<template>
  <div>
    <el-form label-width="60px">
      <el-row :gutter="20">
        <el-col
          :xs="24"
          :sm="12"
          :md="6"
          :lg="6"
        >
          <el-form-item label="年度">
            <el-select
              v-model="filter.year"
              size="small"
              style="width:100%"
              placeholder="不限"
            >
              <el-option
                v-for="item in yearsList"
                :key="item"
                :label="item+'年度'"
                :value="item"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col
          :xs="24"
          :sm="12"
          :md="6"
          :lg="6"
        >
          <el-form-item label="周期">
            <el-select
              v-model="filter.cycle"
              size="small"
              style="width:100%"
              placeholder=""
            >
              <el-option
                label="不限"
                :value="0"
              ></el-option>
              <el-option
                v-for="item in cycleList"
                :key="item"
                :label="'第'+item+'轮'"
                :value="item"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col
          :xs="24"
          :sm="12"
          :md="6"
          :lg="6"
        >
          <el-form-item label="类型">
            <el-select
              multiple
              collapse-tags
              v-model="filter.type"
              size="small"
              style="width:100%"
              placeholder="不限"
            >
              <el-option
                label="年度复训"
                :value="1"
              ></el-option>
              <el-option
                label="专项训练"
                :value="2"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col
          :xs="24"
          :sm="12"
          :md="6"
          :lg="6"
        >
          <el-form-item label="科室">
            <el-select
              v-model="filter.office"
              size="small"
              style="width:100%"
              placeholder=""
            >
              <el-option
                label="不限"
                value="-"
              ></el-option>
              <el-option
                v-for="item in params.userAttribs.office"
                :key="item"
                :label="item"
                :value="item"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col
          :xs="24"
          :sm="12"
          :md="6"
          :lg="6"
        >
          <el-form-item>
            <div>
              <el-button
                icon="el-icon-user"
                type="primary"
                size="small"
                @click="getStatisticTrainee"
              >人员统计</el-button>
              <el-button
                icon="el-icon-document"
                type="success"
                size="small"
                @click="getStatisticExercise"
              >练习统计</el-button>
            </div>

          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>

<script>
  export default {
    name: 'filterPanel',
    data() {
      return {
        filter: {
          year: new Date().getFullYear(),
          cycle: 0,
          type: [],
          office: '-',
          traineeOffice: '-',
        },
      }
    },
    computed: {
      exercisesList() {
        return this.$store.state.existedRecordTitle;
      },
      params() {
        return this.$store.state.params;
      },
      userList() {
        return this.$store.state.userList;
      },
      yearsList() {
        let list = new Array();
        for (let i = 0; i >= -2; i--) {
          list.push(new Date().getFullYear() + i);
        }
        return list;
      },
      cycleList() {
        let list = new Array();
        for (let i = 1; i <= 10; i++) {
          list.push(i);
        }
        return list;
      },
      queriedRecords() {
        return this.$store.state.queriedRecords;
      },
      dialogWidth() {
        return this.$store.getters.dialogWidth;
      },
      tableHeight() {
        if (this.dialogWidth == "600px") {
          return this.$store.state.screenSize.height - 360;
        }
        return this.$store.state.screenSize.height - 420;
      },
    },
    methods: {
      getStatisticTrainee() {
        this.$emit("update", true);
        let responseTime = new Date().getTime();
        console.log("filter", this.filter);
        this.$store.dispatch('getStatisticTrainee', this.filter).then(result => {
          responseTime = new Date().getTime() - responseTime;
          this.$notify.success({
            // title: '查找到' + result.content.length + '人的' + result.countRecordTotal + '条记录，共计' + result.scoreAverageList.length + '个分数排名',
            title: '统计完成',
            message: '响应时间' + responseTime + 'ms，计算时间' + result.microtime + 'ms',
          });
          this.$emit("update", false);
          // console.log(result);
          // console.log("responseTime", );
          // console.log("executeTime", result.microtime);
        });
      },
      getStatisticExercise() {
        this.$notify({
          message: '暂未开发',
          type: 'info',
        });
      },
    },
  }
</script>

<style>

</style>